<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>homePage</title>
  <script type="text/javascript" th:inline="JavaScript"></script>
</head>
<body>
    <div th:fragment="video">
        <!-- 视频设备信息 -->
        <div class="cd-popup3 equipmentInfo equipmentInfo-pop " id="equipmentInfoModal">
            <div class="cd-popup-container3 equipmentInfoModal modalStyle equipmentInfoPopStyle">
                <!-- 小叉 关闭按钮 -->
                <a class="cd-popup-close closeModal" href="javascript:;"></a>
                <div class="modal-title">设备信息</div>
                <div class="bigVideoBox">
                  <video id="video" width="100%" height="100%"></video>
                </div>
                <form id="equipmentInfoForm" style="text-align: left; margin-top: 20px;">
                    <div class="row mb24" style="width:100%;">
                        <div class="fl" style="width:50%;">
                        <div class="col-xs-4">
                            <span>设备名称 :</span>
                        </div>
                        <div class="col-xs-8">
                            <input type="text" class="form-control notEmptyInput disabledStyle equipmentInfoDeviceName" autocomplete="off" disabled>
                        </div>
                        </div>  
                        <div class="fr" style="width:50%;">
                        <div class="col-xs-4" style="text-align: right;">
                            <span>是否启用 :</span>
                        </div>
                        <div class="col-xs-8">
                            <input type="text" class="form-control notEmptyInput disabledStyle equipmentInfoDevUse" autocomplete="off" disabled>
                        </div>
                        </div>
                    </div>
                    <div class="row mb24" style="width:100%;">
                        <div class="fl" style="width:50%;">
                        <div class="col-xs-4">
                            <span>设备类型 :</span>
                        </div>
                        <div class="col-xs-8">
                            <input type="text" class="form-control notEmptyInput disabledStyle equipmentInfoDeviceType" autocomplete="off" disabled>
                        </div>
                        </div>  
                        <div class="fr" style="width:50%;">
                        <div class="col-xs-4" style="text-align: right;">
                            <span>设备编码 :</span>
                        </div>
                        <div class="col-xs-8">
                            <input type="text" class="form-control notEmptyInput disabledStyle equipmentInfoDevCode" autocomplete="off" disabled>
                        </div>
                        </div>
                    </div>
                    <div class="row mb24" style="width:100%;">
                        <div class="fl" style="width:50%;">
                        <div class="col-xs-4">
                            <span>安装地址 :</span>
                        </div>
                        <div class="col-xs-8">
                            <input type="text" class="form-control notEmptyInput disabledStyle equipmentInfoAddress" autocomplete="off" disabled>
                        </div>
                        </div>  
                        <div class="fr" style="width:50%;">
                        <div class="col-xs-4" style="text-align: right;">
                            <span>安装场所 :</span>
                        </div>
                        <div class="col-xs-8">
                            <input type="text" class="form-control notEmptyInput disabledStyle equipmentInfoFixedPlace" autocomplete="off" disabled>
                        </div>
                        </div>
                    </div> 
                    <div class="row mb24" style="width:100%;">
                        <div class="fl" style="width:50%;">
                        <div class="col-xs-4">
                            <span>经度 :</span>
                        </div>
                        <div class="col-xs-8">
                            <input type="text" class="form-control notEmptyInput disabledStyle equipmentInfoLongitude" autocomplete="off" disabled>
                        </div>
                        </div>  
                        <div class="fr" style="width:50%;">
                        <div class="col-xs-4" style="text-align: right;">
                            <span>纬度 :</span>
                        </div>
                        <div class="col-xs-8">
                            <input type="text" class="form-control notEmptyInput disabledStyle equipmentInfoLatitude" autocomplete="off" disabled>
                        </div>
                        </div>
                    </div>
                    <div class="row mb24" style="width:100%;">
                        <div class="fl" style="width:50%;">
                        <div class="col-xs-4">
                            <span>安装日期 :</span>
                        </div>
                        <div class="col-xs-8">
                            <input type="text" class="form-control notEmptyInput disabledStyle equipmentInfoInsDate" autocomplete="off" disabled>
                        </div>
                        </div>  
                        <div class="fr" style="width:50%;">
                        <div class="col-xs-4" style="text-align: right;">
                            <span>截止日期 :</span>
                        </div>
                        <div class="col-xs-8">
                            <input type="text" class="form-control notEmptyInput disabledStyle equipmentInfoDeadline" autocomplete="off" disabled>
                        </div>
                        </div>
                    </div>
                    <div class="row" style="width:100%;">
                        <div class="col-xs-3">
                        <span>备注 :</span>
                        </div>
                        <div class="col-xs-9">
                        <input type="text" class="form-control notEmptyInput disabledStyle equipmentInfoRemark" autocomplete="off" disabled>
                        </div>
                    </div>
                    <div class="row" style="width:100%;">
                        <div class="col-xs-3">
                            <span>所属组织:</span>
                        </div>
                        <div class="col-xs-9">
                            <input type="text" class="form-control notEmptyInput disabledStyle equipmentInfoOrganization" autocomplete="off" disabled>
                        </div>
                    </div>
                </form>
            </div>
        </div>
        <!-- 实时视频 -->
        <div class="cd-popup3 realTimeVideo realTimeVideo-pop" id="realTimeVideoModal">
            <div class="cd-popup-container3 realTimeVideoModal modalStyle realTimeVideoPopStyle">
                <!-- 小叉 关闭按钮 -->
                <a class="cd-popup-close closeModal" href="javascript:;"></a>
                <div class="modal-top"></div>
                <div class="modal-title">实时视频</div>
                <div class="clearfix" style="margin-bottom: 20px;">
                    <input type="text" class="fl searchInputStyle realTimeVideoSearchInput" placeholder="请输入组织或设备名">
                    <span class="fl btnStyle realTimeVideoSearchBtn" id="realTimeVideoSearchBtn">搜索</span>
                </div>
                <!-- 左边组织树 -->
                <div class="realTimeVideoOrgTree">
                    <div class="realTimeVideoOrgList">
                        <div class="realTimeVideoOrgList_scroll">
                        <div class="_panel-box">
                            <ul class="">
                            </ul>
                        </div>
                        </div>
                    </div>
                </div>
                <!-- 右边视频部分 -->
                <div class="videoBox">
                    <ul class="videoRealTimeBoxes clearfix">
                        <li>
                            <div class="realTimeVideoLi realTimeVideo1">
                                <div class="realTimeVideoTop">
                                    <div class="realTimeVideoTopTitle">
                                        设备名称
                                    </div>
                                    <!-- 关闭 -->
                                    <a class="closeModal" href="javascript:;"></a>
                                    <video id="my-video" class="video-js videoRealTimeVideo" controls preload="auto" width="239" height="119" poster="" data-setup="{}">
                                      <!-- <source src=""> -->
                                        <!-- <source src="MY_VIDEO.webm" type='video/webm'> -->
                                    </video>
                                </div>
                                <div class="realTimeVideoBottom">
                                    <div class="realTimeVideoBottomHistoryVideo">历史录像</div>
                                    <div class="realTimeVideoBottomLocation">定位</div>
                                    <div class="realTimeVideoBottomSuspended"></div>
                                    <div class="realTimeVideoBottomStop"></div>
                                </div>
                            </div>
                        </li>
                        <li></li>
                        <li></li>
                        <li></li>
                    </ul>
                </div>

                <!-- 查看历时录像 -->
                <div class="realTimeVideoSeeVideos" style="margin-top: 20px;">
                    <span></span>查看历时录像
                </div>
            </div>
        </div>
    </div>
</body>
</html>